import 'package:flutter/material.dart';
import 'package:flutter_demo/provider/active.dart';
import 'package:flutter_demo/routers/application.dart';
import 'package:flutter_demo/utils/screen_size_fit.dart';
import 'package:provider/provider.dart';

class books extends StatefulWidget {
  @override
  _booksState createState() => _booksState();
}

/*限量300本*/
class _booksState extends State<books> {
  get books => Provider.of<HomeProvider>(context).books;

  @override

  /*限量300本*/
  Widget bookTop() {
    return Container(
        width: 265.w,
        height: 44.w,
        decoration: BoxDecoration(
          image: DecorationImage(
              fit: BoxFit.cover,
              image: AssetImage('assets/images/rewardTop.png')),
        ),
        child: Center(
          child: Text('限量300本·送完即止',
              textAlign: TextAlign.center,
              style: TextStyle(
                  color: Color.fromRGBO(255, 255, 255, 1),
                  fontSize: 22.ssp,
                  decoration: TextDecoration.none)),
        ));
  }

  /*免费领取按钮*/
  Widget takeFreeBtn(int index) {
    return Stack(
      overflow: Overflow.visible,
      children: [
        Container(
            width: 300.w,
            height: 90.w,
            decoration: BoxDecoration(
              image: DecorationImage(
                  fit: BoxFit.cover,
                  image: AssetImage('assets/images/rewardBottom.png')),
            )),
        Positioned(
          top: 0,
          left: 50.w,
          child: GestureDetector(
              onTap: () {
                context.read<HomeProvider>().setCurrIndex(index);
                Application.router.navigateTo(
                  context,
                  '/details?index=$index&title=open',
                );
              },
              child: Container(
                width: 200.w,
                height: 58.w,
                decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(39.w),
                    boxShadow: [
                      BoxShadow(
                          color: Color.fromRGBO(233, 69, 76, 0.6),
                          offset: Offset(0.0, 2.w), //阴影xy轴偏移量
                          blurRadius: 10.w, //阴影模糊程度
                          spreadRadius: 0 //阴影扩散程度
                          )
                    ],
                    gradient: LinearGradient(
                        begin: Alignment.topLeft,
                        end: Alignment.bottomLeft,
                        colors: [
                          Color.fromRGBO(244, 181, 76, 1),
                          Color.fromRGBO(250, 220, 157, 1)
                        ])),
                child: Text('免费领取',
                    textAlign: TextAlign.center,
                    style: new TextStyle(
                      color: Color.fromRGBO(246, 97, 72, 1),
                      fontSize: 35.sp,
                      fontWeight: FontWeight.bold,
                      decoration: TextDecoration.none,
                    )),
              )),
        )
      ],
    );
  }

  /*白色背景书籍卡片*/
  Widget whiteBgCard(int index) {
    return Container(
        margin: EdgeInsets.all(15.w),
        decoration: BoxDecoration(
            color: Color.fromRGBO(255, 255, 255, 1),
            borderRadius: BorderRadius.circular(14.w)),
        child: Center(
          child:
              Image.network(books[index]['pic'], width: 200.w, height: 275.w),
        ));
  }

  /*书籍卡片外壳*/
  List<Widget> bookCard() {
    return List.generate(books.length, (index) {
      return Container(
          width: 300.w,
          height: 375.w,
          margin: EdgeInsets.only(right: 30.w, bottom: 30.w),
          decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(20.w),
              gradient: LinearGradient(
                  begin: Alignment.topLeft,
                  end: Alignment.bottomLeft,
                  colors: [
                    Color.fromRGBO(244, 181, 125, 1),
                    Color.fromRGBO(235, 74, 48, 1)
                  ])),
          child: Stack(
            overflow: Overflow.visible,
            children: [
              whiteBgCard(index),
              Positioned(top: 14.w, left: 18.w, child: bookTop()),
              Positioned(bottom: 0, child: takeFreeBtn(index))
            ],
          ));
    });
  }

  Widget build(BuildContext context) {
    ScreenSizeFit(context);
    return Container(
      width: 750.w,
      padding: EdgeInsets.only(left: 30.w, top: 30.w, bottom: 30.w),
      margin: EdgeInsets.all(30.w),
      color: Color.fromRGBO(254, 246, 230, 1),
      child: Wrap(
        children: bookCard(),
      ),
    );
  }
}
